<template>
  <div class="prism-player" :id="playerId"></div>
</template>

<script>


  export default {
    name: 'Aliplayer',
    props: {
      videoId: {
        type: String,
        default: '',
      },
      playAuth: {
        type: String,
        default: '',
      }
    },
    data() {
      return {
        playerId: 'aliplayer_' + Math.random() * 100000000000000000,
      }
    },
    methods: {
      initAliVideo(videoId, playAuth) {
        let player = new Aliplayer({
          id: this.playerId,
          vid: videoId,
          playauth: playAuth,
          width: '500px',
          height: "400px",
          autoplay: true,
          rePlay: false,
          playsinline: true,
          preload: true,
          controlBarVisibility: "hover",
          useH5Prism: true,
        }, function (player) {
          console.log('播放器创建好了。')
        });
      },
    },
    mounted() {
      this.initAliVideo(this.videoId, this.playAuth);
    },
    created() {

    },
    updated() {
      this.initAliVideo(this.videoId, this.playAuth);
    }
  }
</script>
